﻿@page
@using Localization.Resources.AbpUi
@using Microsoft.Extensions.Localization
@using Volo.Abp.AspNetCore.Mvc.UI.Packages.TuiEditor
@using Volo.Abp.AspNetCore.Mvc.UI.Packages.Uppy
@using Volo.Abp.GlobalFeatures
@using Volo.Abp.Users
@using Volo.CmsKit.GlobalFeatures
@using Volo.CmsKit.Pages
@using Volo.CmsKit.Public.Web.Pages.CmsKit.Shared.Components.Commenting
@using Volo.CmsKit.Public.Web.Pages.CmsKit.Shared.Components.MarkedItemToggle
@using Volo.CmsKit.Public.Web.Pages.CmsKit.Shared.Components.Rating
@using Volo.CmsKit.Public.Web.Pages.CmsKit.Shared.Components.ReactionSelection
@using Volo.CmsKit.Public.Web.Pages.CmsKit.Shared.Components.Tags
@model IndexModel
@inject IStringLocalizer<AbpUiResource> Localizer
@inject ICurrentUser CurrentUser

@section styles{
    <abp-style type="typeof(TuiEditorStyleContributor)"/>
}

@section scripts{
    <abp-script type="typeof(UppyScriptContributor)"/>
    <abp-script type="typeof(TuiEditorScriptContributor)"/>
    <abp-script src="/Pages/index.js"/>
}

<h1 class="text-center">CMS Kit DEMO</h1>

<abp-card>
    <abp-card-body class="p-5">
        <abp-blockquote class="text-center">
            @if (GlobalFeatureManager.Instance.IsEnabled<TagsFeature>())
            {
                @await Component.InvokeAsync(typeof(TagViewComponent), new
                {
                    entityType = "quote",
                    entityId = "1"
                })
            }
        </abp-blockquote>
    </abp-card-body>
</abp-card>

<hr />

<abp-row>
    <abp-column size-md="_6">
        @if (GlobalFeatureManager.Instance.IsEnabled<RatingsFeature>())
        {
            @await Component.InvokeAsync(typeof(RatingViewComponent), new 
            { 
                entityType = "quote",
                entityId = "1",
                isReadOnly = false
            })
        }
    </abp-column>
    <abp-column size-md="_6">
        @if (GlobalFeatureManager.Instance.IsEnabled<ReactionsFeature>())
        {
            @await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new {entityType = "quote", entityId = "1"})
        }
    </abp-column>
    <abp-column size-md="_12">
        @if (GlobalFeatureManager.Instance.IsEnabled<CommentsFeature>())
        {
            @await Component.InvokeAsync(typeof(CommentingViewComponent), new 
            {
                entityType = "quote",
                entityId = "1",
                isReadOnly = false,
                referralLinks  = new [] {"nofollow"}
            })
        }
    </abp-column>
</abp-row>
<abp-card class="mb-2">
    <abp-card-body class="p-5">
        <abp-blockquote class="text-center">
            <p class="h2 mb-4">
                "Writing code is very simple, but writing simple code is the hardest thing there is!"
            </p>
            <p class="m-0"> - Halil ibrahim Kalkan <small class="d-block text-muted">Inspired from Johan Cruyff</small></p>
        </abp-blockquote>
    </abp-card-body>
</abp-card>
<abp-row>
    <abp-column size-md="_6">
        @if (GlobalFeatureManager.Instance.IsEnabled<RatingsFeature>())
        {
            @await Component.InvokeAsync(typeof(RatingViewComponent), new {entityType = "quote", entityId = "2"})
        }
    </abp-column>
    <abp-column size-md="_6">
        @if (GlobalFeatureManager.Instance.IsEnabled<ReactionsFeature>())
        {
            @await Component.InvokeAsync(typeof(ReactionSelectionViewComponent), new {entityType = "quote", entityId = "2"})
        }
    </abp-column>
    <abp-column size-md="_12">
        @if (GlobalFeatureManager.Instance.IsEnabled<CommentsFeature>())
        {
            @await Component.InvokeAsync(typeof(CommentingViewComponent), new {entityType = "quote", entityId = "2"})
        }
    </abp-column>
</abp-row>

<abp-row>
    <abp-column size="_12">
        @if (GlobalFeatureManager.Instance.IsEnabled<TagsFeature>())
        {
            @await Component.InvokeAsync(typeof(TagViewComponent), new
            {
                entityType = "IndexPage",
                entityId = Guid.Empty.ToString()
            })
        }
    </abp-column>
</abp-row>


<hr />
<abp-row>
    @for (int i = 1; i <= 4; i++)
    {
        var name = $"Item {i}";
        <abp-column>
            <abp-card background="Light" text-color="Dark" border="Success" class="mb-3" style="max-width: 18rem;">
                <abp-card-header class="d-flex justify-content-between">
                    <div>
                        Item
                    </div>
                    <div>
                        @await Component.InvokeAsync(typeof(MarkedItemToggleViewComponent), new
                            {
                                entityId = name,
                                entityType = "product",
                                needsConfirmation = true // (optional)
                            })
                    </div>
                </abp-card-header>
                <abp-card-body>
                    <abp-card-title>@name</abp-card-title>
                </abp-card-body>
            </abp-card>
        </abp-column>
    }
</abp-row>